//购物车
$(function(){
	$("#buybox").on({
		mouseenter:function(){
			$(this).addClass("hover");
			$(".zhuangtai").slideDown(1000,function(){})
		},
		mouseleave:function(){
			$(this).removeClass("hover");
			$(".zhuangtai").slideUp(1000,function(){
				$(this).stop(true,false)
			})
		}
	})
})
//侧边导航
$(function(){
		$(".banner-left").children().children().mouseenter(function(){
			var index=$(this).index();
			$('.wrap').css({display:"block"});
			$('.wrap .list').css({display:'none'});
			$('.wrap .list').eq(index).css({display:"block"});
		});


		
		$(".banner-left").children().children().mouseleave(function(){
			var index=$(this).index();
			$('.wrap').css({display:'none'});
			$('.wrap .list').css({display:'none'});
			$('.wrap .list').eq(index).css({display:'none'});
		});
})		
		
//下拉导航
	$(function(){
		var
			timer = null, 
			oShowNav = $('#nav-menu-wrap');
		$('.nav1').mouseenter(function () {
			clearInterval(timer);
			oShowNav.css({display:'block'}).stop().animate({
							height: 234,
						}, 500);
		}).mouseleave(function () {
			timer = setTimeout( function () {
				oShowNav.stop().animate({
					height:0
				}, 500, function () {
					oShowNav.css('display', 'none');
				});
			}, 50);
		});
		$('.nav a').mouseover(function () {
			var iIndex = $(this).index();
			$('#nav-menu ul').css('display', 'none').eq(iIndex).css('display', 'block');
		});
		oShowNav.mouseenter(function () {
			clearInterval(timer);
		}).mouseleave(function () {
			timer = setTimeout( function () {
				oShowNav.stop().animate({
					height:0
				}, 500, function () {
					oShowNav.css('display', 'none');
				});
			}, 50);
		});
	})
	
	
	
	
	
//输入框
$(function(){
	var aIndex = -1;
	var aHtml = $(".box").html();
	var arr=[];
	$("#text").focus(function(){
		$(this).css({border:"1px solid #ff6600",borderRight:0}),
		$(".btn").addClass("bur"),
		$(".icon").fadeOut("fast"),
		$(".result").css("display","block");
	}).blur(function(){
		$(this).css({border:"1px solid #e0e0e0",borderRight:0}),
		$(".btn").removeClass("bur"),
		$(".icon").fadeIn("fast")
		$(".result").css("display","none");
	}).keyup(function(){
		var
			ev = ev || window.event,
			aLi = $('.box li');
		if(ev.keyCode === 38 || ev.keyCode === 40) {
			if(ev.keyCode === 38 && aIndex > 0) {
					aIndex--;
			} else if(ev.keyCode === 40 && aIndex < aLi.length - 1) {
					aIndex++;
			}
			$("#text").val(aLi.removeClass('active').eq(aIndex).addClass('active'));
			document.getElementById("text").value = arr[aIndex];
			}
		}).bind('input propertychange', function () {
			var val = $("#text").val();	
			if(val){
				$.getJSON("http://search.mi.com/search/expand?keyword="+val+"&jsonpcallback=?",function(data){
				 
				var	html="";
					for(var i=0;i<data.length;i++){
						html += '<li><a href="http://search.mi.com/search_' + data[i].Key + '" target="_self">' + data[i].Key +'<span>'+'约有'+data[i].Rst+'件'+'</span></a></li>'				
						arr.push(data[i].Key)
					}
					if(html) {
						$(".box").css('display', 'block').html(html);
					} else {
						$(".box").css('display', 'none');
					}
						aIndex = -1;				
				})	
			}else{
				$(".box").html(aHtml);
				aIndex = -1;
			}
			return arr
		})
	
})
//轮播图
$(function(){
	var Index = 0,
		timer = null,
		btn = $("#btn li"),
	 	aImg = $("#banner img");
	//点击出现图片
	btn.click(function(){
		Index = $(this).index();
		Move(Index);
	})
	//向左
	$("#pre").click(function(){
		Index--;
		if(Index<0){
			Index=aImg.length-1;
		}
		Move(Index);
	})
	//向右
	play();
	$("#next").click(function(){
		Index++;
		if(Index>aImg.length){
			Index=0;
		}
		Move(Index);
	})
	//清除
	$('#banner').hover(function () {
			clearInterval(timer);
		}, function () {
			play();
		});
	//自动播放

	function play(){
		timer=setInterval(function(){
			Index++;
			if(Index>aImg.length-1){
				Index=0;
			}
			Move(Index);
		},3000)
	}
	
	function Move(Index){
		btn.removeClass("cur").eq(Index).addClass("cur");
		aImg.stop(true).animate({opacity:0},500,function(){
			$(this).css('display','none');
		}).eq(Index).css('display', 'block').stop(true).animate({opacity:1},500)		
	}

})
$(function(){
	$("#prero").hover(function(){
		$(".preotext").css('display','block').animate({right:'35px'},'fast');
	},function(){
		$(".preotext").css('display','none').animate({right:'70px'},'fast');
	})
})
//吸顶搜索导航	
$(function(){	
	$(window).scroll(function(){
		var oIndex = -1;
		var search = $(".searchresult")
		var aScroll = $(window).scrollTop();
		var aHtml = search.html();
		if(aScroll>500){
			$(".container-show").css("display","block");
			$("#search").focus(function(){
				$(".hotword").css('opacity',0.3);
			}).blur(function(){
				$(".hotword").css({display:"block",opacity:1});
				
			}).keyup(function(ev){
				$(".hotword").css("display","none");
				var
					ev = ev || window.event,
					aLi = $('.searchresult li');
				if(ev.keyCode === 38 || ev.keyCode === 40) {
					if(ev.keyCode === 38 && oIndex > 0) {
						oIndex--;
					} else if(ev.keyCode === 40 && oIndex < aLi.length - 1) {
						oIndex++;
					}
					//$("#search").val(data('key'));
				}
				}).bind('input propertychange', function () {
					var value = $(this).val();
					if(value) {
					$.ajax({
						url: 'https://suggest.taobao.com/sug?code=utf-8',
						data: {q: value},
						jsonp: 'callback',						
						dataType: 'jsonp',
						success: function (data) {
							var sHtml = '';
							(data.result).forEach(function (v) {
								sHtml +='<li><a href="javascript:;"><span>约有' + v[1] + '件</span>' + v[0] + '</a></li>' ;
							});
							if(sHtml) {
								search.css('display', 'block').html(sHtml);
							} else {
								search.css('display', 'none');
							}
							oIndex = -1;
						}
					});
					}else{
						search.html(aHtml);
						oIndex = -1;
					}		
				})			
			}else if(aScroll<500){
				$(".container-show").css("display","none");
			}		
	})
					
})
//左侧导航
$(function(){
	
	$(window).scroll(function(){
		var scrollTop = $(window).scrollTop();	
		
		if(scrollTop>=700){
			$(".fp-list").stop().css('display','block').animate({width:36,height:600},'slow')
			$(".fpList a:not('.list9')").click(function(){
				var index = $(this).index();
				
			});
			$('.list9').click(function(){
				 $('body,html').animate({scrollTop:0},1000);
			});
		}else if(scrollTop<700){
			$(".fp-list").stop().animate({width:0,height:0},'slow')
		}
		
	})	
})
//放大镜
$(function(){
	$("#smallpic").mouseover(function(){
		$("#move").css('display','block');
		$("#bigpic").css('display','block');
	}).mouseout(function(){
		$("#move").css('display','none');
		$("#bigpic").css('display','none');
	}).mousemove(function(e){
		var evt = e || event;
	
		var x = evt.clientX  - $(this).offset().left - $("#move").width()/2;
		var y = evt.clientY + $(window).scrollTop() - $(this).offset().top  - $("#move").height()/2;
		console.log(x)
		if(x < 0){
			x = 0;
		}else if(x > $(this).width() - $("#move").width()){
				x = $(this).width() - $("#move").width();
		}
		if(y < 0){
			y = 0;	
		}else if(y > $(this).height() -$("#move").height() ){
				y = $(this).height() - $("#move").height();
		}
		$("#move").css({left:x+"px",top:y+"px"});
		perX = x / $(this).width() ;
		perY = y /$(this).height()
		$("#pic2").css({
			left:-$("#pic2").width()*perX+"px",
			top:-$("#pic2").height()*perY+"px"
		})
	})	
	$(".piclist li").click(function(){
		var index = $(this).index();
		console.log(index)
		$(".piclist img").removeClass("slide").eq(index).addClass("slide");
		console.log($("#pic1").attr("src"))
		$("#pic1").attr({src:'images/xiaomi5'+index+'.jpg'});
		$("#pic2").attr({src:'images/xiaomi5'+index+'.jpg'});
	})
	
})
	
	







